fix(@angular/build): use stable worker filenames during dev server#32940
fix(@angular/build): use stable worker filenames during dev server#32940maruthang wants to merge 1 commit intoangular:mainfrom
Conversation
… prevent hash changes on rebuild During `ng serve`, web workers were always bundled with `entryNames: 'worker-[hash]'` regardless of whether the parent build used hashing. Combined with inherited `footer` and `splitting` options from the parent build that could change between rebuilds, this caused the worker filename hash to change on every rebuild even when the worker content was unchanged, breaking debugging sessions. The fix conditionally uses `worker-[hash]` only when the parent build uses hashing (production builds), and `worker-[name]` otherwise (dev server). It also explicitly sets `splitting: false` and `footer: undefined` in the worker build to prevent non-deterministic output that could affect hashing. Closes angular#30494
There was a problem hiding this comment.
Code Review
This pull request updates the Angular application builder to support both hashed and non-hashed Web Worker filenames, which prevents debugging sessions from breaking during development rebuilds. The bundling logic is modified to conditionally apply hashing based on the parent build's configuration and disables features like splitting and footers to ensure deterministic output. The review feedback suggests refining the regular expressions used for matching worker filenames by replacing the broad '.+' pattern with a more specific '[\w-]+' character set to improve robustness.
| */ | ||
| const REFERENCED_WORKER_REGEXP = | ||
| /new Worker\(new URL\("worker-[A-Z0-9]{8}\.js", import\.meta\.url\)/; | ||
| /new Worker\(new URL\("worker-.+\.js", import\.meta\.url\)/; |
There was a problem hiding this comment.
For improved robustness in this test, consider making the regular expression more specific. The .+ pattern is quite broad. Using [\w-]+ instead would restrict matches to alphanumeric characters, underscores, and hyphens, which more accurately reflects the expected worker filenames (worker-[name].js or worker-[hash].js).
| /new Worker\(new URL\("worker-.+\.js", import\.meta\.url\)/; | |
| /new Worker\(new URL\("worker-[\w-]+\.js", import\.meta\.url\)/; |
| */ | ||
| const REFERENCED_WORKER_REGEXP = | ||
| /new Worker\(new URL\("worker-[A-Z0-9]{8}\.js", import\.meta\.url\)/; | ||
| /new Worker\(new URL\("worker-.+\.js", import\.meta\.url\)/; |
There was a problem hiding this comment.
For improved robustness in this test, consider making the regular expression more specific. The .+ pattern is quite broad. Using [\w-]+ instead would restrict matches to alphanumeric characters, underscores, and hyphens, which more accurately reflects the expected worker filenames (worker-[name].js or worker-[hash].js).
| /new Worker\(new URL\("worker-.+\.js", import\.meta\.url\)/; | |
| /new Worker\(new URL\("worker-[\w-]+\.js", import\.meta\.url\)/; |
| // Match both hashed (worker-ABCD1234.js) and non-hashed (worker-<name>.js) patterns | ||
| const workerCodeFile = workerResult.outputFiles.find((file) => | ||
| /^worker-[A-Z0-9]{8}.[cm]?js$/.test(path.basename(file.path)), | ||
| /^worker-.+\.[cm]?js$/.test(path.basename(file.path)), |
There was a problem hiding this comment.
The regex .+ is a bit too broad and could potentially match unexpected file names. For improved robustness, consider using a more specific character set that matches valid file name characters, such as [\w-]+. This would match alphanumeric characters, underscores, and hyphens, which should cover both [name] and [hash] replacements.
| /^worker-.+\.[cm]?js$/.test(path.basename(file.path)), | |
| /^worker-[\w-]+\.[cm]?js$/.test(path.basename(file.path)), |
Summary
ng serve, web worker bundles always usedentryNames: 'worker-[hash]'regardless of whether the parent build used hashing, causing the worker filename hash to change on every rebuild even when worker content was unchangedworker-[hash]only for production builds (when parent uses hashing) andworker-[name]for dev server, keeping worker filenames stable across rebuildssplitting: falseandfooter: undefinedin the worker build to prevent inherited options from causing non-deterministic outputCloses #30494
Test plan
ng servewith a web worker no longer changes the worker filename on unrelated rebuildsng build) still use hashed worker filenames for cache busting